<template>
  <!-- 我的下级 -->
  <div class="form-box">
    <el-table height="55vh" :data="list" stripe border>
      <el-table-column label="序号" type="index" width="60" align="center" />
      <el-table-column label="UID" prop="userId" width="80" align="center" />
      <el-table-column label="消费券" prop="amount" width="100" align="center">
        <template slot-scope="scope">
          <span v-if="scope.row.ioType == 1"> +{{scope.row.amount}}</span>
          <span v-else>-{{scope.row.amount}}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作类型" prop="op_type" width="100" align="center">
        <template slot-scope="scope">
          <span v-if="scope.row.opType ==10">转卖获益</span>
          <span v-else-if="scope.row.opType ==20">商城消费</span>
          <span v-else-if="scope.row.opType ==84">管理端批量赠送</span>
          <span v-else-if="scope.row.opType ==85">管理端单个赠送</span>
        </template>
      </el-table-column>
      <el-table-column label="创建时间" prop="createTime" width="160" align="center" />
      <el-table-column label="说明" prop="remark" min-width="100" align="center" />

    </el-table>
    <pagination class="page-view" v-show="totalNum > 0" :total="totalNum" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
  </div>

</template>

<script>
import { listAppLogConsume } from "@/api/vip/vip";

export default {
  name: 'FormConsumer',
  props: {
    queryParams: {
      type: Object,
    },
  },

  data() {
    return {
      loading: false,
      list: [],
      totalNum: 0
    }
  },

  created() {
    this.getList();
  },

  methods: {
    getList() {
      this.loading = true;
      this.queryParams.id = this.queryParams.userId;
      listAppLogConsume(this.queryParams).then((response) => {
        if (response.code == 200) {
          this.list = response.data;
          this.totalNum = response.total;
        }
        this.loading = false;
      });
    }
  }
}
</script>
<style scoped>
.page-view {
  margin-top: 10px;
  height: 50px;
}
</style>
